// import {ajax_tool} from './common.js';
import {login} from './request.js';

const userName = document.querySelector('.userName input');
const userPhone = document.querySelector('.userPhone input');
const userIdentity = document.querySelector('.userIdentity input');
const btn = document.querySelectorAll('.btn button');
const masking = document.querySelector('.masking')
const close = document.querySelector('.close')
// console.log(userName,userPhone,userIdentity)
// 监听验证表单事件是否为空
userName.addEventListener('blur', checkNull);
userPhone.addEventListener('blur', checkNull);
userIdentity.addEventListener('blur', checkNull);

// 监听验证表单事件输入格式是否正确
userName.addEventListener('blur', checkName);
userPhone.addEventListener('blur', checkPhone);
userIdentity.addEventListener('blur', checkIdentity);

// 点击按钮注册预约
btn[1].addEventListener('click', function(e) {
    e.preventDefault()
    // 验证用户信息
    if (inputs()) {
        // 验证成功登录请求
        getdata("html/session.html");
    } else {
        masking.className = "masking  mistake";
    }
})

// 点击关闭错误弹框
close.addEventListener("click", function() {
    this.parentNode.parentNode.className = "masking";
})

// 验证表单是否为空的函数
function checkNull() {
    let value = this.value;
    let conTainer = this.parentNode.parentNode;
    let text = conTainer.lastElementChild.getAttribute('data-text');
    if (!value) {
        // 先清除之前的成功和失败类
        conTainer.classList.remove('error');
        conTainer.classList.remove('succeed');
        // 添加失败类
        conTainer.classList.add('error');
        conTainer.lastElementChild.innerHTML = `${text}为必填项`;
    }
}

// 创建一个对象用来存储用户信息
let objs = {};

// const checkItems = [
//     {
//         input: userName, 
//         regs: /^[a-zA-Z][a-zA-Z0-9_]{4,15}$/,
//         errorText: '姓名格式错误',
//         name: 'name'
//     }
// ]

// function check({input, regs, errorText, name}){
//     let value = input.value;
//     if (value == "") {
//         return false;
//     }
//     let conTainer = input.parentNode.parentNode;
//     // 先清除之前的成功和失败类
//     conTainer.classList.remove('error');
//     conTainer.classList.remove('succeed');
//     if (regs.test(value)) {
//         // 添加成功类
//         conTainer.classList.add('succeed');
//         objs[name] = value;
//         return true;
//     }
//     // 添加失败类
//     conTainer.classList.add('error');
//     conTainer.lastElementChild.innerHTML = errorText;
//     return false
// }

// 验证姓名表单格式是否正确的函数
function checkName() {
    let value = userName.value;
    if (value == "") {
        return false;
    }
    let conTainer = userName.parentNode.parentNode;
    let text = conTainer.lastElementChild.getAttribute('data-text');
    let regs = /[\u4e00-\u9fa5]/;
    // 先清除之前的成功和失败类
    conTainer.classList.remove('error');
    conTainer.classList.remove('succeed');

    if (regs.test(value)) {
        // 添加成功类
        conTainer.classList.add('succeed');
        objs.name = value;
        return true;
    }
    // 添加失败类
    conTainer.classList.add('error');
    conTainer.lastElementChild.innerHTML = `${text}格式错误`;
    return false
    
}

// 验证电话表单格式是否正确的函数
function checkPhone() {
    let value = userPhone.value;
    if (value == "") {
        return false;
    }
    let conTainer = userPhone.parentNode.parentNode;
    let text = conTainer.lastElementChild.getAttribute('data-text');
    let regs = /^(13[0-9]|14[5|7]|15[0|1|2|3|4|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$/
    // 先清除之前的成功和失败类
    conTainer.classList.remove('error');
    conTainer.classList.remove('succeed');
    if (regs.test(value)) {
        // 添加成功类
        conTainer.classList.add('succeed');
        objs.phone = value;
        return true;
    } else {
        // 添加失败类
        conTainer.classList.add('error');
        conTainer.lastElementChild.innerHTML = `${text}格式错误`;
        return false;
    }
}

// 验证身份证表单格式是否正确的函数
function checkIdentity() {
    let value = userIdentity.value;
    if (value == "") {
        return false;
    }
    let conTainer = userIdentity.parentNode.parentNode;
    let text = conTainer.lastElementChild.getAttribute('data-text');
    let regs = /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;
    // 先清除之前的成功和失败类
    conTainer.classList.remove('error');
    conTainer.classList.remove('succeed');
    if (regs.test(value)) {
        // 添加成功类
        conTainer.classList.add('succeed');
        objs.card = value;
        return true;
    } else {
        // 添加失败类
        conTainer.classList.add('error');
        conTainer.lastElementChild.innerHTML = `${text}格式错误(15位、18位数字)`;
        return false;
    }
}

// 请求数据回来后的异步async...await
async function getdata(url) {
    // 开始加载动画
    masking.className = "masking loading"
    // 登录请求
    let responseData = await login(objs);
    // 把数据存进浏览器的缓存
    sessionStorage.setItem("phone", userPhone.value);
    sessionStorage.setItem('name', userName.value);
    sessionStorage.setItem('token', responseData.result.token);
    // 关掉加载动画
    masking.className = "masking";
    location.href = url;
    console.log(responseData);
}

// 三个表单都验证一遍函数
function inputs() {
    return checkName() && checkPhone() && checkIdentity();
    // return  !checkItems.filter(item=> !check(item)).length
}

// 添加查看预约记录事件
btn[0].addEventListener('click', function(e) {
    e.preventDefault();
    if (inputs()) {
        // 把数据存进浏览器的缓存
        // 登录请求
        getdata("html/record.html");
    } else {
        masking.className = "masking  mistake";
    }
});

